<template>
<li @click='selectOptionClick' class="bh-select-dropdown__item" :class="{'selected': itemSelected,}">
	<slot>{{currentLabel}}</slot>
</li>
</template>

<script>
import Emitter from '../../../../src/mixins/emitter';
export default {
	name: 'bh-option',
	componentName: 'BHOption',
	mixins: [Emitter],
	inject: ['select'],//就是父级 select 的 this
	props: {
		type: String,
		value: {
			required: true
		},
		label: [String, Number],
	},
	computed: {
		currentLabel() {
			return this.label || this.value;
		},
		itemSelected() {
			if (!this.select.multiple) {
				return this.select.value == this.value;
			} else {
				return this.select.value == this.value;
			}
		},
	},
	methods: {
		selectOptionClick() {
			console.log('options:click');
			this.$dispatch('BHSelect', 'handleOptionClick', [this, true]);
		},
	},
	created() {
		//console.log('select', this.select);
		this.select.options.push(this);
		this.select.optionsCount++;
	}
}
</script>
